<script setup>
import TwoColumnsResizView from "@/components/BaseComponents/TwoColumnsResizView.vue"
import {usePiniaTestStore} from "@/store/store.js";
import {usePiniaLocalTestStore} from "@/store/localstore.js";
const store = usePiniaTestStore()
const storeLocal = usePiniaLocalTestStore()

</script>

<template>
  <TwoColumnsResizView>
    <template v-slot:left>
      <div>
        <p class="text-lg text-rose-500">非持久化:</p>
        <el-input  v-model="store.testText" style="width: 240px"/>
        <p class="text-purple-700">持久化:</p>
        <el-input  v-model="store.localText" style="width: 240px"/>
        <p>localstore持久化1:</p>
        <el-input  v-model="storeLocal.testText" style="width: 240px"/>
        <p>localstore持久化2:</p>
        <el-input  v-model="storeLocal.localText" style="width: 240px"/>
      </div>
    </template>

    <template v-slot:right>
      <div>
        <p>非持久化:</p>
        <span>{{store.testText}}</span>
        <p>持久化:</p>
        <span>{{store.localText}}</span>
        <p>localstore持久化1:</p>
        <span>{{storeLocal.testText}}</span>
        <p>localstore持久化2:</p>
        <span>{{storeLocal.localText}}</span>
      </div>
    </template>
  </TwoColumnsResizView>
</template>

<style scoped>

</style>